<div nz-row nzType="flex" nzJustify="space-around">
    <!-- 左侧参数设置区域 -->
    <div nz-col nzSpan="5">
        <form nz-form [formGroup]="paramForm" (ngSubmit)="paramFormSubmit()">
            <nz-form-item> <!-- 节点文本设置 -->
              <nz-form-label nzRequired nzFor="textAttrName">节点文本属性名称</nz-form-label>
              <nz-form-control nzErrorTip="属性名为必填项，默认：title">
                <nz-input-group>
                  <input type="text" nz-input formControlName="textAttrName" id="textAttrName" placeholder="树形控件节点对象文本属性名称" />
                </nz-input-group>
              </nz-form-control>
            </nz-form-item>

            <nz-form-item> <!-- 节点 key 设置 -->
                <nz-form-label nzRequired nzFor="keyFieldName">结果集主键字段名</nz-form-label>
                <nz-form-control nzErrorTip="主键字段名为必填项，默认：auto_key">
                  <nz-input-group>
                    <input type="text" nz-input formControlName="keyFieldName" id="keyFieldName" placeholder="二维数组中主键字段名称" />
                  </nz-input-group>
                </nz-form-control>
            </nz-form-item>

            
            <nz-form-item> <!-- 提交按钮 -->
                <nz-form-control>
                    <button nz-button [nzType]="'primary'">生成树形代码</button>
                </nz-form-control>
            </nz-form-item>


          </form>
    </div>

    <div nz-col nzSpan="18">
        <div nz-col nzSpan="24">
            title : 使用 ng-zorro-antd 的树形控件 nzTree 构建树，其 node 节点上显示文本的属性是 title 
        </div>
        <div nz-col nzSpan="24">
            auto_key :  自定义的编程规范中后端返回的数据都必须带有唯一主键，如果没有那么在数据库端生成，字段名默认为 auto_key
        </div>
        <div nz-col nzSpan="24">
            <textarea rows=18 nz-input [(ngModel)]="generatedCode"></textarea>
        </div>
    </div>
</div>